<%@ page contentType="text/html; charset=UTF-8" language="java" pageEncoding="UTF-8"%>
<%@include file="/common/taglibs.jsp"%>
<%@include file="/common/javascript.jsp" %>
<html xmlns="http://www.w3.org/1999/xhtml" id="teacherForm">
<head>
    <title>播放${fileName}</title>
    <base target="_self"/>
    <style>
        .l-table-edit-td { padding: 2px; }
    </style>
    <script type="text/javascript" src="${ctx}/static/flowplayer/flowplayer-3.2.12.min.js"></script> 
    <script type="text/javascript">
    var pType = "${pType}";
    if (pType == "flv")
    {
	    $(function (){
	    	$f("player", "${ctx}/static/flowplayer/flowplayer-3.2.16.swf", 
	                {   
	                    clip: {  
	                        autoPlay: true,
	                        autoBuffering: true                        
	                    },
	                    playlist: [
	                        "${ctx}/qso/material/download?materialId=${id}", 
	                    ]    
	                }
	            );  
	            event.preventDefault();
	    });
    }
    else
    {
    	$(function (){
    		$('a.media').media({width:1200, height:1000});
    	});
    }
    
 </script>
</head>

<body>
	<table cellpadding="0" cellspacing="0" class="l-table-edit" style="width: 90%; margin-top:10px; margin-left:15px;">
	    
		<tr> 
			<td colspan="4">
			<c:if test="${pType=='flv'}">
				<div style="width: 640px;height:480px;background-color:#444;color:#fff" id="player" class="player"></div>
			</c:if>
			<c:if test="${pType=='pdf'}">
				<a class="media" href="${ctx}/download/material/${id}">${id}</a> 
				<!--  <a class="media" href="${ctx}//static/files/test.pdf">PDF</a>  -->
			</c:if>
			
			</td>
		</tr>
	</table>
</body>
</html>
